/* Import Poppins from Google Fonts
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");

 
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css"); */

/* Apply Poppins globally */

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Black.woff2') format('woff2'),
        url('Poppins-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-BlackItalic.woff2') format('woff2'),
        url('Poppins-BlackItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Bold.woff2') format('woff2'),
        url('Poppins-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-BoldItalic.woff2') format('woff2'),
        url('Poppins-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-ExtraBold.woff2') format('woff2'),
        url('Poppins-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-ExtraBoldItalic.woff2') format('woff2'),
        url('Poppins-ExtraBoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-ExtraLight.woff2') format('woff2'),
        url('Poppins-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-ExtraLightItalic.woff2') format('woff2'),
        url('Poppins-ExtraLightItalic.woff') format('woff');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Italic.woff2') format('woff2'),
        url('Poppins-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Light.woff2') format('woff2'),
        url('Poppins-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-LightItalic.woff2') format('woff2'),
        url('Poppins-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Medium.woff2') format('woff2'),
        url('Poppins-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-MediumItalic.woff2') format('woff2'),
        url('Poppins-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Regular.woff2') format('woff2'),
        url('Poppins-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-SemiBold.woff2') format('woff2'),
        url('Poppins-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-SemiBoldItalic.woff2') format('woff2'),
        url('Poppins-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Thin.woff2') format('woff2'),
        url('Poppins-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-ThinItalic.woff2') format('woff2'),
        url('Poppins-ThinItalic.woff') format('woff');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

* {
  margin: 0; 
  padding: 0;
  box-sizing: border-box;
     font-family: 'Poppins' !important;
}

p,
table thead tr th,
table tbody tr th,
table tbody tr td {
  font-size: 16px !important;
  line-height: 1.6 !important;
}

/* .search-box {
  width: 250px;
  display: flex;
  flex-direction: column;
} */

.search-box input {
  width: 100%;
  padding: 8px;
}

/* .search-results {
  position: absolute;
  
  top: 100%;
  left: 0;
  width: 100%;
  background: #fff;
  border: 1px solid #ccc;
  display: none;
  max-height: 250px;
  overflow-y: auto;
  z-index: 9999;
} */

.search-box {
  position: relative;
  z-index: 10000;
}

.search-results {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  max-height: 250px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid #ccc;
  z-index: 9999;
  display: none;
  scrollbar-width: none; /* Firefox */
}
/* Ensure no clipping */
.header-section,
.header-container,
.nav-container {
  overflow: visible;
}

.search-results div {
  padding: 10px;
  cursor: pointer;
  border-bottom: 1px solid #eee;
}

.search-results div:hover {
  background: #f2f2f2;
}

.section-title {
  font-size: 36px !important;
  margin: 0 0 10px 0 !important;
  color: #000000 !important;
  font-weight: 500 !important;
}

.pt-1 {
  padding-top: 10px !important;
}

.top-bar-section_new {
  width: 100%;
  background: #ffe83b;
  padding: 10px 0;
  color: #fff;
  font-family: Arial;
}

/* Top Yellow Bar */
.top-bar-section {
    width: 18% !important;
    background: #007dcb;
    padding: 5px 6px;
    color: #fff;
    FLOAT: inline-end;
    font-family: Arial;
    clip-path: polygon(25px 0%, 100% 0%, 100% 100%, 0% 100%);
    
}

.breadcrumb-inner a {
  font-weight: 500 !important;
  font-size: 18px;
}

.current-page {
  font-size: 18px !important;
  font-weight: 600 !important;
}

.dropdown {
  min-width: max-content !important;
}

.top-bar {
  max-width: 1520px;
  margin: auto;
   display: flex; 
  justify-content: end;
  align-items: center;
 gap: 5px; 
}

.banner-text {
  color: var(--gail-yellow);
  font-size: 48px !important;
  font-weight: 800;
  margin: 0px 0px 0px 11%;
  text-transform: capitalize;
}

/* Yellow Breadcrumb Bar */
.breadcrumb-container {
  background-color: var(--gail-yellow);
  padding: 12px 0;
}

.breadcrumb-inner {
  margin-left: 11%;
  font-weight: bold;
  font-size: 1.1rem;
  color: var(--gail-blue);
}

.social-icons {
  display: flex;
  gap: 10px;
}
.social-icons  a{
  display: flex;
  align-items: center;
}
.social-icons i {
  margin-right: 12px;
  cursor: pointer;
  font-size: 14px;
  transition: 0.3s;
}

.social-icons i:hover {
  color: #ffe83b;
}

.stock-info {
  display: flex;
  align-items: center;
  gap: 10px;
}

.svg-inline--fa {
  color: #007dcb;
  font-size: 20px;
}

.stock-title {
  font-weight: bold;
  color: #ffffff;
  margin-top: 2px;
  margin-right: 5px;
  letter-spacing: 1px;
}

.stock-btn {
  padding: 0px 20px;
  border: none;
  background: #007dcb;
  color: #fff;
  border-radius: 3px;
  cursor: pointer;
  font-size: 16px;
  transition: 0.3s;
}

.stock-btn a {
  text-decoration: none;
  color: #fff;
}

/* .stock-btn:hover{
  background:#ffd700;
} */

/* Header */

div#header-placeholder {
  background: #fff;
  position: relative;
}

.header-section {
  width: 82%;
  /* background: #ffffff; */
  /* border-bottom: 1px solid #ddd; */
  padding: 0px 25px;
  margin: 0 auto;
      display: flex;
    gap: 50px;
  
}

.header-container {
  width: 100%;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}

.logo {
    width: auto;
    height: 74px;
}
.gov-logo-section {
    position: relative;
    left: 0px;
  
}
.gov-logo-new {
  width: 70px;
}
.gov-logo {
  width: 95px;
}
.gov-logo_2 {
  width: 200px;
}
span.enrgy {
    color: #30b53e;
    font-weight: 500;
}

span.majr {
    color: #00b4e1;
    font-weight: 500;
}
.search-box {
  display: flex;
  align-items: center;
  border: 1px solid #ccc;
  border-radius: 4px;
  /* overflow: hidden; */
  width: 30%;
}

.search-box input {
  border: none;
  padding: 10px;
  outline: none;
  width: 100%;
  font-size: 20px;
}

.search-btn {
  background: #fff;
  border: none;
  color: #268bcd;
  padding: 10px;
  cursor: pointer;
  font-size: 20px;
}

/* Navigation */

/* navbar */
.navbar {
  min-height: auto !important;
}
.header_navbnar {
  background: #007dcb;
  padding-block: 0;
  position: relative;
}

.nav-container {
  width: min(100%, 1700px);
  margin: 0 auto;
  padding-inline: clamp(12px, 2vw, 24px);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  min-height: 39px;
}

.menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: none;
  background: transparent;
  color: #fff;
  font-size: 22px;
  cursor: pointer;
  align-items: center;
  justify-content: center;
}

.header_navbnar .nav-menu {
  list-style: none;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
  gap: 5px;
}

.nav-menu > li {
  position: relative;
  margin: 0 !important;
}

/* top menu links */
.header_navbnar .nav-menu > li > a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px clamp(10px, 1vw, 18px);
  text-decoration: none;
  color: #fff;
  font-size: clamp(13px, 0.9vw, 16px);
  font-weight: 500;
  background: transparent;
  transition: 0.3s ease;
  position: relative;
  z-index: 2;
  white-space: nowrap;
  padding-block: 5px;
}

/* desktop hover */
.header_navbnar .nav-menu > li:hover > a,
.header_navbnar .nav-menu > li > a:focus {
  background: #fff;
  color: #007dcb;
}

.header_navbnar .nav-menu > li:hover > a .fa-angle-down,
.header_navbnar .nav-menu > li > a:focus .fa-angle-down {
  color: #007dcb;
}

.fa-angle-down {
  color: #fff;
  transition: 0.3s ease;
}

/* dropdown */
.header_navbnar .dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: max-content;
  max-width: min(92vw, 720px);
  background: #fff;
  padding: 12px 14px 16px;
  border-radius: 0 0 22px 22px;
  box-shadow: 0 18px 35px rgba(0, 0, 0, 0.18);
  z-index: 99;
  border-top: none !important;
}

.header_navbnar .nav-menu > li:hover > .dropdown,
.header_navbnar .nav-menu > li:focus-within > .dropdown {
  display: block;
}

.header_navbnar .dropdown a {
  display: block;
  background: #f4f4f4;
  color: #111 !important;
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  padding: 10px;
  margin-bottom: 10px;
  white-space: nowrap;
}

.header_navbnar .dropdown a:last-child {
  margin-bottom: 0;
}

.header_navbnar .dropdown a:hover,
.header_navbnar .dropdown a.active {
  background: #007dcb !important;
  color: #ffe83b !important;
}

.header_navbnar .dropdown a:hover .svg-inline--fa {
  color: #ffe83b;
}

.drp_block {
  display: flex;
  gap: 10px;
}

/* Banner */

.banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffe83b;
  min-height: 420px;
}

.banner-left {
  width: 50%;
}

.banner-left img {
  width: 100%;
  height: 420px;
  object-fit: cover;
}

.banner-right {
  width: 50%;
  padding: 40px;
}

.banner-right h4 {
  font-size: 28px;
  color: #555;
}

.banner-right h1 {
  font-size: 60px;
  color: #333;
  margin: 10px 0;
}

.banner-right p {
  font-size: 24px;
  color: #555;
}

.sustain-content {
  max-height: 450px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  margin-bottom: 50px;
}

.sustain-content .tabcontent {
  margin-left: 0 !important;
}

.progress {
  margin-top: 30px;
  background: #d0e3a5;
  height: 14px;
  border-radius: 10px;
  width: 80%;
}

.progress span {
  display: block;
  height: 14px;
  background: #7fbf5b;
  width: 60%;
  border-radius: 10px;
}

.gail-business {
  padding: 48px 16px;
  background-color: #ffffff;
  /* margin-top: 20px; */
}



 .gail-business__inner {
    max-width: 1540px;
    margin: 0 auto;
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(237px, 1fr));
} 

/* Tile */
.gail-business__item {
  position: relative;
  display: block;
  border-radius: 4px;
  overflow: hidden;
  text-decoration: none;
  color: #ffffff;
}

/* Image */
.gail-business__img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition:
    transform 0.3s ease,
    filter 0.3s ease;
}

/* Overlay content */
.gail-business__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 16px;
  pointer-events: none;
  /* clicks pass to anchor */
}

.gail-business__icon img {
  width: 40px;
  height: 40px;
  margin-bottom: 12px;
}

.gail-business__title {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.4;
  font-weight: 700;
  text-shadow: 0 2px 5px rgba(0, 0, 0, 0.7);
}

/* Hover */
.gail-business__item:hover .gail-business__img {
  transform: scale(1.04);
  /* filter: brightness(0.85); */
}

/* Overlay */

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: white;
  padding: 20px;
  font-weight: 600;
}

.overlay h3 {
  font-size: 18px;
  line-height: 1.4;
}

/* Hover Effect */

.business-card:hover img {
  transform: scale(1.1);
}

.business-card:hover .overlay {
  background: rgba(0, 0, 0, 0.6);
}

/* Responsive */

.vision-mission {
  width: 100%;
  margin: 0 auto;
}

/* Vision */

.vision-box {
  background: #ffe83b;
  padding: 25px 200px;
  display: flex;
  align-items: center;
  gap: 100px;
}

.vision-left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-direction: row;
}

.vision-left img {
  width: 60px;
}

.vision-left h2 {
  font-size: 32px;
  color: #0066b3;
}

.vision-text {
  font-size: 16px;
  color: #333;
  max-width: 100%;
}

/* Mission */

.mission-box {
  background: #007dcb;
  padding: 25px 201px;
  display: flex;
  align-items: center;
  justify-content: end;
  color: white;
  gap: 100px;
}

.mission-text {
  font-size: 16px;
  max-width: 700px;
}

.mission-right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-direction: row;
}

.banner-image-container {
  /* Replace 'banner-full.jpg' with your actual image file */

  background-size: cover !important;
  /* Use aspect-ratio to keep the image proportional */
  /* Example: if your image is 1600x400, use 4/1 */
  aspect-ratio: 14 / 4 !important;
}

.mission-right img {
  width: 60px;
  margin-left: 15px;
}

.mission-right h2 {
  font-size: 32px;
  color: #ffe83b;
}

.cruise_logo {
  width: 100px;
  display: block;
  margin-bottom: 20px;
  position: absolute;
  left: 4px;
  top: 5px;
}

.career-nav li a.cractive {
  background: #d3d3d3;
  color: #000;
}

.about-left h2 {
  font-size: 36px;
  margin: 0 0 10px 0;
  color: #1a1a1a;
  font-weight: 500;
}

/* Responsive */

.info-card {
  min-width: 350px !important;
}

.gail-about-section {
  padding: 70px 80px;
  background: #f5f5f5;
}

.gail-about-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 60px;
  max-width: 1500px;
  margin: 0 auto;
}

/* Left Content */

.gail-about-text {
  max-width: 520px;
}

.gail-about-text h2 {
  font-size: 46px;
  font-weight: 500;
  margin-bottom: 15px;
  line-height: 1.3;
}

.title-line {
  width: 170px;
  height: 4px;
  background: #007dcb;
  margin-bottom: 20px;
}

.gail-about-text p {
  color: #666;
  line-height: 1.7;
  margin-bottom: 30px;
  text-align: justify;
}

/* Button */

.about-btn {
  padding: 15px 45px;
  border: 1px solid #444;
  background: white;
  cursor: pointer;
  font-size: 15px;
  transition: 0.3s;
}

.about-btn:hover {
  background: #007dcb;
  color: white;
  border-color: #007dcb;
}

.about-btn a {
  color: #000;
  text-decoration: none;
}

.about-btn:hover a {
  color: #fff;
}

/* Image */

.gail-about-image img {
  width: 730px;
  border-radius: 20px;
  object-fit: cover;
}

.more-about-section {
  padding: 50px 10px 50px 250px !important;
  background-color: #f9f9f9 !important;
}

.more-about-section .header-container {
  width: 100% !important;
  margin: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.more-about-section .more-title {
  font-weight: 500 !important;
  position: relative !important;
  margin-bottom: 40px !important;
  font-size: 24px !important;
}

.more-title::after {
  content: "";
  display: block;
  width: 100%;
  height: 3px;
  background-color: var(--gail-blue) !important;
  position: absolute;
  bottom: -8px;
}

.more-about-section .carousel-controls {
  display: flex !important;
  gap: 10px !important;
}

.more-about-section .nav-btn {
  background: white !important;
  border: 1px solid #ddd !important;
  border-radius: 50% !important;
  width: 40px !important;
  height: 40px !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.2rem !important;
  color: #666 !important;
  transition: 0.3s !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1) !important;
}

.more-about-section .nav-btn {
  background: white !important;
  border: 1px solid #ddd !important;
  border-radius: 50% !important;
  width: 40px !important;
  height: 40px !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.2rem !important;
  color: #666 !important;
  transition: 0.3s !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1) !important;
}

.more-about-section .cards-grid {
  display: flex !important;
  gap: 25px !important;
  padding: 25px 5px !important;
  scroll-behavior: smooth !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}

.more-about-section .info-card {
  background-color: #ececec !important;
  min-width: 350px !important;
  height: 100px !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 20px !important;
  cursor: pointer !important;
  transition: background 0.3s !important;
  text-decoration: none !important;
}

.more-about-section .card-number {
  position: absolute !important;
  top: -25px !important;
  left: 25px !important;
  background-color: var(--gail-yellow) !important;
  color: #000 !important;
  font-weight: bold !important;
  padding: 10px 20px !important;
  font-size: 1.1rem !important;
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1) !important;
}

.more-about-section .card-text {
  font-weight: bold !important;
  color: #333 !important;
  margin-top: 10px !important;
}

/* Responsive */

/* Wrapper */
.gail-info {
  background-color: #d9d9d9;
  /* light grey background */
  padding: 30px 16px;
}

.gail-info__inner {
  max-width: 1500px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 80px;
  justify-content: center;
}

/* Card */
.gail-info-card {
  background-color: #ffffff;
  border-radius: 20px;
  box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.08);
  width: 314px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 300px;
}

/* Card header (yellow strip) */
.gail-info-card__header {
    background-color: #ffe83b;
    /* padding: 16px 20px; */
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    text-align: center;
    flex-direction: column;
    height: 38px;
    margin: 10px auto;
    width: 94%;
    border-radius: 10px;
    margin-bottom: 0;
}

.gail-info-card__header--press {
  /* optional modifier if you want specific tweaks */
}

.gail-info-card__icon img {
  width: 24px;
  height: 24px;
}

.gail-info-card__heading-group {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.gail-info-card__heading {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  color: #000000;
}

.gail-info-card__subheading {
  margin: 4px 0 0;
  font-size: 0.85rem;
  color: #333333;
  font-weight: 700;
}

/* Media area */
.gail-info-card__media {
  padding: 10px;
  flex: 1;
}

.gail-info-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 12px;
}

/* Social icons layout */
.gail-info-card__media--social {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
    gap: 40px;
  flex-direction: column;
}

.gail-info-card__media--social img {
  width: 60px;
  height: 60px;
}

.card_social_menu {
  display: flex;
  justify-content: space-around;
  margin-top: 30px;
}

.card_sec_social_menu {
  display: flex;
  justify-content: space-evenly;
}

/* Body */
.gail-info-card__body {
  padding: 16px 10px 10px;
  display: flex;
  flex-direction: column;
  gap: 0px;
}

.gail-info-card__body--center {
  align-items: center;
  justify-content: center;
}

.gail-info-card__meta {
  margin: 0;
  font-size: 0.75rem;
  color: #666666;
}

.gail-info-card__text {
  margin: 0;
  font-size: 0.9rem;
  color: #222222;
  line-height: 1.5;
}

.gail-info-card__link {
  margin-top: 4px;
  font-size: 0.9rem;
  color: #0080c9;
  text-decoration: none;
  font-weight: 600;
}

.gail-info-card__link:hover {
  text-decoration: underline;
}

/* Section base */
.gail-applications {
  background-color: #ffd800;
  /* approximate blue from screenshot */
  padding: 48px 16px;
}

.gail-applications__inner {
  max-width: 1500px;
  margin: 0 auto;
}

/* Header */
.gail-applications__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 32px;
}

.gail-applications__title {
  color: #000;
  font-size: 2.8rem;
  font-weight: 500;
  margin: 0 0 8px;
  letter-spacing: 1px;
}

.gail-applications__underline {
  display: block;
  width: 190px;
  height: 4px;
  background-color: #007dcb;
  /* yellow underline */
  border-radius: 2px;
}

/* View All button */
.gail-applications__view-all {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 32px;
  border-radius: 2px;
  border: 1px solid #000;
  color: #000;
  text-decoration: none;
  font-size: 1rem;
  background-color: transparent;
  transition:
    background-color 0.2s ease,
    color 0.2s ease;
  white-space: nowrap;
}

.gail-applications__view-all:hover {
  background-color: #ffffff;
  color: #0080c9;
}

/* Cards layout */
.gail-applications__cards {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: flex-start;
}

/* Card */
.gail-card {
  background-color: #ffffff;
  border-radius: 10px;
  box-shadow: 0 8px 12px rgba(0, 0, 0, 0.15);
  overflow: hidden;
  /* width: 280px; */
  /* desktop width */
  display: flex;
  flex-direction: column;
  min-height: 280px;
}

.gail-card__image img {
  display: block;
  width: 100%;
  height: 180px;
  object-fit: cover;
}

.sahyog_shdw {
  box-shadow: 0px 0px 0px 1px #00000029;
}

.gail-card__body {
  padding: 14px 12px 18px;
  text-align: center;
}

.gail-card__title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
  color: #222222;
  line-height: 1.4;
}

/*Gail application*/

.gail-card__image {
  margin: 10px;
  border-radius: 5px;
  overflow: hidden;
}

/* RESPONSIVE BEHAVIOUR */

.global-section {
  background: #ffffff;
  padding: 30px 8%;
  font-family: Arial, Helvetica, sans-serif;
}

.global-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 60px;
}

/* Left Text */

.global-text {
  max-width: 520px;
}

.global-text h2 {
  font-size: 48px;
  line-height: 1.2;
  margin-bottom: 20px;
  font-weight: 500;
}

.underline {
  width: 120px;
  height: 4px;
  background: #1e88e5;
  margin-bottom: 25px;
}

.global-text p {
  color: #555;
  line-height: 1.7;
  margin-bottom: 30px;
}

/* Button */

/* .know-btn {
  display: inline-block;
  padding: 14px 30px;
  border: 1px solid #333;
  text-decoration: none;
  color: #333;
  transition: 0.3s;
}

.know-btn:hover {
  background: #333;
  color: white;
} */

.knw_btn {
  text-decoration: none;
  color: #000;
}

/* Image */

.global-image img {
  width: 100%;
  max-width: 915px;
}

/* Responsive */

/* Wrapper */
.gail-footer-full {
  background-color: #007dcb;
  /* blue like screenshot */
  padding: 0 0 10px;
  position: relative;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}

/* Top rounded toggle button */
.gail-footer-toggle {
  position: absolute;
  top: -22px;
  left: 50%;
  transform: translateX(-50%);
  width: 126px;
  height: 44px;
  border-radius: 35px;
  border: none;
  background-color: #0077bf;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow:
    0px 1px 3px 0px #00000063,
    inset 0px -1px 3px 0px #ffffff85;
}

.gail-footer-toggle__icon {
  font-size: 20px;
}

.gail-footer-toggle svg {
  width: 50px;
  height: 42px;
}

/* Inner layout */
.gail-footer-full__inner {
  max-width: 76%;
  margin: 0 auto;
  padding: 40px 24px 0;
  display: flex;
  /* grid-template-columns: 1.1fr 1.1fr 1.1fr;   */
  column-gap: 90px;
  row-gap: 32px;
  color: #ffffff;
  justify-content: space-between;
}
.lst_futr_colmn {
  max-width: 285px;
}
/* Column titles */
.footer-col__title {
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 16px;
  color: #ffe933;
  margin-bottom: 35px;
}

/* Lists */
.footer-col__list {
  list-style: disc;
  margin: 0;
  padding-left: 18px;
}

.footer-col__list li {
  margin: 4px 0;
}

.footer-col__list a {
  color: #ffffff;
  text-decoration: none;
  font-size: 16px;
  line-height: 1.6;
}

.footer-col__list a:hover {
  text-decoration: underline;
}

.gail-footer-full__btm {
}

.futr_btm_lnks {
}

.futr_btm_lnks a {
  color: #fff;
  text-decoration: none;
}

/* Make content slide */
.gail-footer-full__content {
  overflow: hidden;
  max-height: 1000px;
  /* will be reset by JS on load */
  transition: max-height 0.4s ease;
}

.futr_btm_lnks {
  color: #fff;
  display: flex;
  max-width: 74%;
  margin: 0 auto;
  justify-content: space-between;
  margin-block: 15px;
}

/* Button visuals (same as before, plus arrow rotation animation) */
.gail-footer-toggle__icon svg {
  transition: transform 0.3s ease;
}

/* When collapsed: rotate arrow up */
.gail-footer-full--collapsed .gail-footer-toggle__icon svg {
  transform: rotate(180deg);
}

/* Optional: tighten padding when collapsed so the blue area shrinks a bit */
.gail-footer-full--collapsed .gail-footer-full__inner {
  padding-top: 0;
  padding-bottom: 0;
}

.gail-footer-full--collapsed .footer-bottom {
  padding-top: 0;
  padding-bottom: 0;
}

.gail-footer {
  font-family: Arial, sans-serif;
  text-align: center;
}

/* Yellow section */
.footer-info {
  background-color: #ffe600;
  color: #0077b6;
  padding: 20px 15px;
  font-size: 15px;
  line-height: 1.8;
}

.footer-info p {
  text-align: center !important;
  margin-bottom: 0px !important;
}

.footer-info a {
  color: #0077b6;
  text-decoration: underline;
  font-weight: 600;
}

/* Blue bottom bar */
.footer-bottom {
  background-color: #0077bf;
  color: #ffe600;
  padding: 12px;
}

.footer-bottom p {
  text-align: center;
}

.stats-section {
  background: #007dcb;
  padding: 6px 0;
}

.stats-container {
  max-width: 1200px;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 20px;
}

.stat-card {
  background: #f3f3f3;
  border-radius: 12px;
  padding: 20px 10px;
  text-align: center;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15);
  transition: 0.3s;
}

.stat-card:hover {
  transform: translateY(-5px);
}

.stat-card img {
  height: 32px;
  margin-bottom: 10px;
}

.stat-number {
  display: inline-block;
  background: #0070c0;
  color: #ffd800;
  padding: 5px 12px;
  border-radius: 20px;
  font-weight: bold;
  font-size: 14px;
  margin-bottom: 8px;
}

.stat-card p {
  font-size: 12px;
  color: #004b8d;
  font-weight: 600;
}

/* journey */
.journey {
  padding: 60px 0;
}

.timeline {
  background: white;
  padding: 30px;
  border-radius: 10px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
}

.timeline ul {
  margin-top: 10px;
}

.timeline li {
  margin-bottom: 8px;
}

/* more section */
.more {
  background: #eee;
  padding: 60px 0;
}

.more-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}

.more-card {
  background: #ddd;
  padding: 20px;
  text-align: center;
  border-radius: 6px;
}

.more-card span {
  display: block;
  background: #ffd800;
  width: 30px;
  margin: auto;
  margin-bottom: 10px;
}

.table td,
.table th {
  padding: 0.65rem !important;
}

.fourplex p {
  color: #666;
  font-size: 16px;
  margin-top: 5px;
}

.imp-notice p > strong {
  float: left;
  padding: 0 15px 0 0;
}

.text-theme {
  color: #0088d7;
}

p#countValue {
  border: 2px solid #007dcb;
  width: max-content;
  margin: 0 auto;
  padding-inline: 10px;
  margin-top: 11px;
  font-weight: 700;
}
p#countValue1 {
  border: 2px solid #007dcb;
  width: max-content;
  margin: 0 auto;
  padding-inline: 10px;
  margin-top: 11px;
  font-weight: 700;
}
section.sutain-inner {
  max-width: 1500px;
  margin: 20px auto;
}

/*media section*/

/* large tablet */
@media (max-width: 1199px) {
  .header_navbnar .nav-menu > li > a {
    padding: 12px 10px;
    font-size: 14px;
  }

  .drp_block {
    flex-direction: column;
  }
}

/* tablet/mobile */
@media (max-width: 991px) {
  .menu-toggle .svg-inline--fa {
    color: #fff;
    font-size: 20px;
  }

  .menu-toggle {
    display: inline-flex;
  }

  .nav-container {
    justify-content: flex-end;
    padding-block: 8px;
  }

  .header_navbnar .nav-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 12px;
    right: 12px;
    background: #007dcb;
    flex-direction: column;
    align-items: stretch;
    padding: 10px 12px 14px;
    border-radius: 0 0 12px 12px;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.18);
    z-index: 9999;
  }

  .header_navbnar .nav-menu.active {
    display: flex;
  }

  .nav-menu > li {
    width: 100%;
  }

  .header_navbnar .nav-menu > li > a {
    width: 100%;
    justify-content: space-between;
    padding: 14px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
    white-space: normal;
  }

  .header_navbnar .dropdown {
    position: static;
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    border-radius: 12px;
    box-shadow: none;
    margin-top: 6px;
    padding: 10px;
  }

  .header_navbnar .nav-menu > li:hover > .dropdown,
  .header_navbnar .nav-menu > li:focus-within > .dropdown {
    display: none;
  }

  .header_navbnar .nav-menu > li.open > .dropdown {
    display: block;
  }

  .header_navbnar .dropdown a {
    white-space: normal;
    font-size: 14px;
    margin-bottom: 8px;
  }

  .banner {
    min-height: auto;
  }

  .drp_block {
    flex-direction: column;
    gap: 0;
  }
}

/* mobile */
@media (max-width: 767px) {
  .header-section {
    width: 100%;
    /* background: #ffffff; */
    border-bottom: 1px solid #ddd;
    padding: 10px 0;
    margin: 0 auto;
    padding-bottom: 0;
  }
  h2 {
    font-size: 28px !important;
  }
  .nav-container {
    padding-block: 0px;
  }
  .blue-overlay {
    padding: 8px 0;
  }
  .banner-text {
    font-size: 21px !important;
    margin-left: 4% !important;
  }
  .breadcrumb-inner {
    margin-left: 4% !important;
  }
  .top-bar {
    flex-direction: column;
    align-items: center;
    gap: 14px;
    margin-block: 10px;
  }

  .header-container {
    gap: 12px;
  }
  .futr_btm_lnks {
    max-width: 86%;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 0;
  }
  .logo {
    width: 100px;
  }

  .gov-logo {
    width: 60px;
  }

  .stock-info {
    width: 100%;
  }

  .menu-toggle .svg-inline--fa {
    color: #fff;
    font-size: 20px;
  }

  .gail-about-section {
    padding: 25px 20px;
  }
  .gail-business__inner {
    gap: 5px;
    grid-template-columns: repeat(auto-fit, minmax(115px, 1fr));
  }
  .gail-business {
    margin-top: 0;
    padding-top: 15px !important;
  }

.about-left h2 { font-size: 20px !important; }

}

/* very small screens */
@media (max-width: 480px) {
  .top-bar,
  .header-container,
  .nav-container {
    padding-inline: 12px;
  }

   


  .social-icons {
    gap: 8px;
    width: 100%;
  }

  .social-icons .svg-inline--fa { 
    font-size: 14px;
}
.stock-btn {
    padding: 0px 6px;}
    .top-bar { 
        gap: 5px;}
            .stock-btn a {
        padding: 0px 10px;}

  .stats-section {
    padding: 30px 0;
  }

  .stock-info {
    gap: 8px;
    justify-content: center;
  }

  .stock-btn a {
    padding: 7px 10px;
    font-size: 13px;
  }

  .header_navbnar .nav-menu > li > a {
    font-size: 14px;
    padding: 12px 10px;
  }
  .gail-info-card {
    max-width: 380px !important;
  }
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .gail-business {
    padding: 32px 12px;
  }

  .gail-business__title {
    font-size: 0.95rem;
  }

  .gail-business__icon img {
    width: 32px;
    height: 32px;
  }
  .stat-card {
    min-height: 270px;
  }
}

@media (max-width: 1100px) {
  .business-container {
    grid-template-columns: 1fr;
  }

  .business-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .business-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .banner {
    flex-direction: column;
    min-height: auto;
  }

  .banner-left,
  .banner-right {
    width: 100%;
  }

  .search-box {
    display: none;
  }
}

@media (max-width: 900px) {
  .vision-box,
  .mission-box {
    flex-direction: column;
    text-align: justify;
    gap: 20px;
    padding: 25px 20px;
  }
}

@media (max-width: 1100px) {
  .gail-about-container {
    flex-direction: column;
    text-align: center;
  }

  .gail-about-text {
    max-width: 100%;
  }

  .gail-about-image img {
    width: 100%;
  }

  .title-line {
    margin: auto;
    margin-bottom: 20px;
  }
}

/* Responsive */
@media (max-width: 1024px) {
  .gail-info__inner {
    justify-content: center;
    gap: 20px;
  }

  .gail-info-card {
    width: 45%;
    max-width: 320px;
  }
}

@media (max-width: 640px) {
  .gail-info {
    padding: 32px 12px;
  }

  .gail-info-card {
    width: 100%;
    max-width: 340px;
  }

  .owl-theme .owl-dots,
  .owl-theme .owl-nav {
    display: none;
  }
}

/* Tablets: 2–3 cards per row depending on width */
@media (max-width: 992px) {
  .gail-applications__header {
    flex-direction: column;
    align-items: flex-start;
  }

  .gail-applications__view-all {
    align-self: flex-end;
  }

  .gail-card {
    width: calc(33.333% - 16px);
    min-width: 220px;
    flex: 1 1 calc(33.333% - 16px);
  }
}

/* Mobiles: full-width cards */
@media (max-width: 600px) {
  .gail-applications {
    padding: 32px 12px;
  }

  .gail-applications__header {
    align-items: flex-start;
  }

  .gail-applications__title {
    font-size: 1.8rem;
  }

  .gail-card {
    width: 100%;
    max-width: 360px;
  }

  .gail-applications__cards {
    justify-content: center;
  }
}

@media (max-width: 900px) {
  .global-container {
    flex-direction: column;
    text-align: center;
  }

  .underline {
    margin: 20px auto;
  }

  .global-text {
    max-width: 100%;
  }

  .global-text p {
    text-align: justify !important;
  }
}

/* Responsive */
@media (max-width: 1100px) {
  .gail-footer-full__inner {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 800px) {
  .gail-footer-toggle {
    top: -18px;
  }

  .stock-info {
    justify-content: end;
    margin-right: 20px;
  }

  .gail-footer-full__inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 32px 16px 16px;
    flex-direction: column;
  }

  .stats_block {
    width: 82% !important;
  }

  .gail-applications__inner {
    max-width: 82% !important;
  }

  .gail-card {
    width: calc(33.333% - 16px);
    min-width: 100%;
    flex: 1 1 calc(33.333% - 16px);
  }

  .gail-applications .owl-nav .owl-prev {
    left: -50px;
  }

  .gail-applications .owl-nav .owl-next {
    right: -50px;
  }

  .gail-footer-full__inner {
    max-width: 90%;
  }
}

@media (max-width: 600px) {
  .gail-footer-full__inner {
    grid-template-columns: 1fr;
    padding: 28px 12px 16px;
  }

  .footer-col__title {
    font-size: 1.02rem;
  }
}
@media (max-width: 1500px) {
  .gail-info__inner {
    max-width: 90%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: center;
  }
}

/*about page */

@media (max-width: 768px) {
  .breadcrumb-inner a {
    font-size: 14px;
  }
  .current-page {
    font-size: 16px !important;
  }

  .about-section,
  .map-presence-section,
  .vision-mission-section {
    padding: 30px 25px !important;
  }
  .about-right img {
    width: 100%;
  }
  .about-top {
    gap: 0 !important;
  }
  .stat-card {
    padding: 10px !important;
  }
  .about-right img {
    width: 100% !important;
    height: 100% !important;
  }
  .map-presence-title { font-size: 21px; }
  .map_new {
    width: 99% !important;
  }
  .stats-container {
    grid-template-columns: repeat(2, 1fr) !important;
    padding-inline: 10px;
  }
  .more-about-section {
    padding: 50px 10px 50px 5px !important;
  }
  .modal-content {
    width: 80% !important;
    height: 300px !important;
  }
  .close-modal {
    top: -10px !important;
    right: 16px !important;
  }
  svg.svg-inline--fa.fa-xmark {
    color: #fff;
  }

  /*our vision */
  .vm-image img {
    width: 100% !important;
    height: 100% !important;
  }
  .vm-container {
    gap: 18px !important;
  }
  .banner-image-container {
    aspect-ratio: 16 / 5 !important;
  }
  .blue-overlay {
    padding: 5px 0 !important;
  }
  /*ends here*/
}
/* .text_marquee {
    font-size: 18px;
    font-weight: 600;
    color: #ffffff;
    text-align: center;
        position: relative;
    right: 34%;
    display: flex;
    gap: 150px;
 

}
span.marquee_new {
    background: #007dcb;
    border-radius: 20px;
    padding: 8px;
} */

.text_marquee {
    font-size: 18px;
    font-weight: 600;
    color: #007dcb;
    display: flex;
    justify-content: space-around;
    align-items: center;
    width:90%;
}

span.marquee_new {
    /* background: #007dcb; */
    border-radius: 20px;
    padding: 6px 12px;
    box-shadow: 1px 3px 3px 1px #007dcb;
}

span.screen_reader {
    font-size: 18px;
    font-weight: 500;
    color: #ffffff;
}
/* --- BLACK THEME OVERRIDES --- */
body.theme-black {
    background-color: #000 !important;
    color: #ffffff !important; /* Global text becomes white */
}

/* 1. Backgrounds: Force all containers to Black */
body.theme-black .compliance-wrapper,
body.theme-black .about-section,
body.theme-black .compliance-content,
body.theme-black .presence-container,
body.theme-black main,
body.theme-black section,
body.theme-black .content-box {
    background: #000 ;
   
}
body.theme-black .energy-hero{
     background: url("../img/MNGC_bg.png") center center / cover no-repeat !important;
}

/* 2. Text Flip: Change all Black/Gray text to White or Yellow */
body.theme-black h1, 
body.theme-black h2, 
body.theme-black h3, 
body.theme-black h4,
body.theme-black p, 
body.theme-black span,
body.theme-black li,
body.theme-black .eoi-text,
body.theme-black .year-item,
body.theme-black .card-text {
    color: #ffffff !important; /* Changes black text to white */
}
body.theme-black .gail-card span,
body.theme-black .stat-card p{
  color: #000 !important;
}
/* 3. Specifically highlight headings in GAIL Yellow */
body.theme-black h2, 
body.theme-black .section-title,
body.theme-black .banner-text {
    color: #ffed00 !important;
}

/* 4. Table & List Rows: Change borders and internal text */
body.theme-black .eoi-row {
    border: 1px solid #444 !important;
    background: #1a1a1a !important;
}
body.theme-black .eoi-text {
    background-color: transparent !important;
    color: #ffffff !important;
}

/* 5. Buttons & Tabs: Invert colors */
body.theme-black .download-btn {
    background-color: #ffed00 !important;
    color: #000 !important; /* Button text stays black for contrast */
}

body.theme-black .comp-tab {
    color: #ffffff !important;
}
body.theme-black .comp-tab.active {
    background-color: #ffed00 !important;
    color: #000 !important;
}

/* 6. Breadcrumb adjustment: Keep it legible */
body.theme-black .breadcrumb-container {
    background-color: #ffed00 !important;
}
body.theme-black .breadcrumb-inner a,
body.theme-black .breadcrumb-inner span {
    color: #007bc3 !important; /* Keep breadcrumb links blue as they are on a yellow background */
}

/* --- RESPONSIVE MEDIA QUERIES FOR TOP BAR --- */

/* 1. Large Screens (Default - as you had it) */
@media (min-width: 1200px) {
    .top-bar-section {
        width: 26%;
    }
}

/* 2. Tablets and Laptops (992px to 1199px) */
@media (max-width: 1199px) {
    .top-bar-section {
        width: 40%; /* Increase width so items don't squash */
    }
}

/* 3. Small Tablets (768px to 991px) */
@media (max-width: 991px) {
    .top-bar-section {
        width: 60%; /* Use more space */
    }
    .stock-title, .screen_reader {
        font-size: 14px !important; /* Scale text down */
    }
}

/* 4. Mobile Phones (up to 767px) */
@media (max-width: 767px) {
    .top-bar-section {
        width: 100%; /* Full width for mobile */
        clip-path: none; /* Remove slant on mobile for better readability */
        padding: 10px 0;
        display: flex;
        justify-content: center;
    }
    
    .top-bar {
        flex-direction: column; /* Stack elements */
        gap: 10px;
    }
    
    .stock-btn {
        font-size: 14px;
        padding: 0 10px;
    }
    
    span.screen_reader {
        font-size: 14px !important;
    }
}

svg.svg-inline--fa.fa-desktop.icon_dekstop {
    color: white !important;
}

@media (max-width: 1200px) {
    .header-section {
        width: 95%; /* Expand container width */
        gap: 50px;  /* Reduce large gap */
    }
    
    .top-bar-section {
        width: 25% !important; /* Give more room for stock buttons */
    }

    .gov-logo-section {
        left: 0; /* Remove the manual offset */
    }
}
@media (max-width: 992px) {
    .header-section {
        flex-direction: column; /* Stack logo and search/social */
        align-items: center;
        gap: 20px;
        padding: 20px;
    }

    .header-container {
        flex-direction: column;
        gap: 15px;
    }

    .search-box {
        width: 80%; /* Make search box wider on tablet */
    }

    .top-bar-section {
        width: 100% !important; /* Top bar spans full width */
        clip-path: none; /* Remove polygon for better mobile look */
        float: none;
    }

    .top-bar {
        justify-content: center;
    }
}
@media (max-width: 600px) {
    .logo {
        width: 120px; /* Smaller logo for mobile */
    }

    .stock-info {
        flex-wrap: wrap;
        justify-content: center;
    }

    .stock-btn {
        padding: 5px 10px;
        font-size: 14px;
    }

    .search-box {
        width: 100%;
    }

    .social-icons {
        justify-content: center;
        margin-top: 10px;
    }

    .gov-logo {
        width: 100px; /* Scale down government logo */
    }
    
    .gov-logo-section {
        left: 0;
        text-align: center;
    }
}




svg.svg-inline--fa.fa-facebook-f {
    color: #1877F2;
}
svg.svg-inline--fa.fa-youtube {
    color: #CD201F;
}
svg.svg-inline--fa.fa-instagram

 {
    color: #E4405F;
  
}
svg.svg-inline--fa.fa-linkedin {
    color: #0A66C2;
}
svg.svg-inline--fa.fa-x-twitter {
    color: #000000;
}

.emergency {
    position: absolute;
    right: 2px;
    bottom: 46px;
    z-index: 10;
    display: flex;
    align-items: center;
    gap: 7px;
    background-color: #fff;
}

@media only screen and (min-width:300px) and (max-width:499px) {

.header-section { width: 100%;
    flex-direction: inherit; }

    .top-bar { margin: 0;
    width: 100%;
    display: flex;
    flex-direction: inherit; }

    .header-container { flex-direction: inherit;
    gap: inherit;
    justify-content: end; }

    .logo { width: 110px !important; }
    .gov-logo-new { width: 45px; }

      .emergency { position: inherit; bottom: inherit;}
      .gov-logo { width: 70px; }

      .about-right img { width: 100%; }

}
#languageSwitcher {font-size: 15px;
    padding: 5px 10px;
    background: #007dcb;
    color: #fff;
    border-radius: 5px;
    border: none;
}

    .lang-wrapper{
    position:relative;
    width:auto;    
}

.lang-wrapper svg{
    position:absolute;
    inset:0;
    pointer-events:none;
}

.lang-wrapper select{
    position:absolute;
    inset:0;
    opacity:0;
    cursor:pointer;}

    /* .cards-grid {
  display: flex;
  gap: 25px;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

.cards-grid::-webkit-scrollbar {
  display: none;
} */

/* language select modal */

.language-modal{
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.9);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 999999;
}

.language-modal.show{
    display:flex !important;
}

/* .language-modal-content{
    background:#fff;
    padding:30px;
    border-radius:10px;
    min-width: 693px;
    min-height: 200px;
}

.lang-hi{
    display:none;
} */

.lang-en{
    display:none;
} 

.popup_lang { text-align: center; }
.popup_lang label { font-size: 20px; }
.popup_lang button { display: block; margin:  20px auto 0; background: #007dcb; color: #fff;     font-size: 16px; cursor: pointer;
    padding: 4px 10px;
    border-radius: 5px; }
.popup_lang h4 {font-size: 20px;
    margin-bottom: 20px;}


    .language-modal{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.75);
    backdrop-filter:blur(4px);
    display:none;
    justify-content:center;
    align-items:center;
    z-index:99999;
}

.language-modal-content{
    width:725px;
    max-width:95%;
    background:#fff;
    border-radius:30px;
    padding:40px 40px 20px;
    text-align:center;
    position:relative;
    overflow:hidden;
    box-shadow:0 25px 70px rgba(0,0,0,.25);
}

.language-modal-content::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:140px;
    height:140px;
    background-image:radial-gradient(#f4c500 1px, transparent 1px);
    background-size:10px 10px;
    opacity:.5;
}

.lang-logo img{
    width:90px;
    margin-bottom:10px;
}

.language-modal-content h2{
    color:#0d2f6b;
    font-size:25px;
    font-weight:700;
    margin:0;
    position: relative;
    z-index: 1;
}

.language-modal-content h2.eng { margin-bottom: 15px; }

.language-modal-content p{
    font-size:22px;
    margin:10px 0 20px;
}

.divider{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:12px;
    margin-bottom:35px;
}

.divider span{
    width:70px;
    height:2px;
    background:#f3c600;
}

.divider .dot{
    width:14px;
    height:14px;
    background:#f3c600;
    border-radius:50%;
}

.language-options{
    display:flex;
    justify-content:center;
    gap:35px;
    margin-bottom:35px;
}

.lang-card{
    width:150px;
    height:140px;
    border:2px solid #d7d7d7;
    border-radius:22px;
    cursor:pointer;
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    transition:.3s;
}

.lang-card input{
    display:none;
}

.lang-card:has(input:checked){
    border-color:#0057d8;
    background:#f4f8ff;
}

.lang-icon{
    width:60px;
    height:60px;
    border-radius:50%;
    display:flex;
    justify-content:center;
    align-items:center;
    font-size:25px;
    margin-bottom:18px;
}

.globe{
    background:#eaf3ff;
}

.hindi{
    background:#eef8e7;
    color:#1d6b16;
    font-weight:700;
}

.lang-text{
    font-size:18px;
    font-weight:700;
}

.checkmark{
    position:absolute;
    top:15px;
    right:15px;
    width:30px;
    height:30px;
    border-radius:50%;
    background:#0057d8;
    color:#fff;
    display:none;
    justify-content:center;
    align-items:center;
}

.lang-card:has(input:checked) .checkmark{
    display:flex;
}

#languageConfirmBtn{
    border:none;
    background:#0047b8;
    color:#fff;
    font-size:24px;
    font-weight:600;
    padding:18px 70px;
    border-radius:14px;
    cursor:pointer;
}

#languageConfirmBtn:hover{
    background:#003894;
}

.footer-industrial{
    margin-top:5px;
}

.footer-industrial img{
    width:100%;
    max-width:700px;
}



.multiply-side { width: 500px; }
.multiply-side .gail-info-card { width: 100% !important; }
.multiply-side img { height: 100% !important; }
.gail-info-card { width: 280px; }

.menu_text { display: none; position: absolute; top: 11px; left: 15px; font-size: 15px;  font-weight: 600; text-transform: uppercase; color: #fff; letter-spacing: 0.9px; }

.about-gas-section h2.gas-title { font-size: 30px; }

.menu-toggle { background: #005696; }

.gov-logo-new.lang-hi { border-radius: 10px; }

.logo-section { padding-top: 10px; }

/* #languageLoader {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.90);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

#languageLoader.hide {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}


.language-spinner {
    width: 120px;
    height: 120px;
    border: 8px solid #fdcc00;
    border-top-color: #00964a;
    border-radius: 50%;
    animation: languageSpin 2.0s linear infinite;
    margin: 0 auto;
}

.language-loader-text img {width: 85px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);}


@keyframes languageSpin {
    to {
        transform: rotate(360deg);
    }
}


.loader-second {
  width: 65px;
  height: 65px;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  border: 3px solid;
  border-color: #fdcc00 #fdcc00 transparent;
  -webkit-animation: rotation 1s linear infinite;
          animation: rotation 1s linear infinite;
}
.loader-second:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  border: 3px solid;
  border-color: transparent #00964a #00964a;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  -webkit-animation: rotationBack 0.5s linear infinite;
          animation: rotationBack 0.5s linear infinite;
  transform-origin: center center;
}



@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


@keyframes rotationBack {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
} */